<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>Title</title>
</head>
<style>
    *{
        padding: 0px;
        margin: 0px;
    }
    .banner{
        width: 1190px;
        background:rgba(0,0,0,.6) ;
        margin: 0 auto;
        border-radius: 50px;
        margin: 0 auto;
    }
    .clearfix::after{
        display: table;
        clear:both;
        content: "";
    }
    .fl{
        float: left;
    }
    .fr{
        float: right;
    }
    .img img{
        width: 120px;
        margin: 0px 50px;
    }
     a{
        text-decoration: none;
        color: #CCCCCC;
        padding:0px 5px;
        box-sizing: border-box;
    }
     .title a:hover{
         color: #0237C3;
     }
    .title{
        height:80px;
        line-height: 80px;
        font-family: 宋体;
    }
    .footer{
        height:80px;
        line-height: 80px;
        margin-right: 50px;
        font-family: 华文隶书;


    }
    .footer a:nth-of-type(1){
        color: #FAD65C;
        border: 1px solid #FAD65C;
        padding: 5px 25px;
        border-radius: 20px;
    }
    .footer a:nth-of-type(2){
        color: #9A6E13;
        background:#FAD65C ;
        border: 1px solid #FAD65C;
        padding: 5px 15px;
        border-radius: 20px;
    }
</style>
<body>
<div class="box">
    <a href="index.html">作业一</a>
    <a href="demo.html">作业二</a>
    <a href="new.html">作业三</a>
    <a href="temp.html">作业四</a>
    <div class="banner clearfix">
        <div class="img fl">
            <img src="img/logo.png" alt="">
        </div>
        <div class="title fl ">
            <a href="#">功能特权</a>
            <a href="#">游戏特权</a>
            <a href="#">生活特权</a>
            <a href="#">会员活动</a>
            <a href="#">成长体系</a>
            <a href="#">年费专区</a>
            <a href="#">超级会员</a>
        </div>
        <div class=" footer fr">
            <a href="#">登录</a>
            <a href="#"> 开通超级会员</a>
        </div>
    </div>
</div>
</body>
</html>